import React, { Component } from 'react';  
import { useState } from 'react';  
  
// 类组件示例  
class ClassComponent extends Component {  
  constructor(props) {  
    super(props);  
    this.state = { text: 'Hello from ClassComponent' };  
  }  
  
  render() {  
    return (  
      <div>  
        <p>{this.state.text}</p>  
        <button onClick={() => this.setState({ text: 'Updated Text' })}>  
          Update Text  
        </button>  
      </div>  
    );  
  }  
}  
  
// 函数组件示例  
function FunctionalComponent() {  
  const [text, setText] = useState('Hello from FunctionalComponent');  
  
  return (  
    <div>  
      <p>{text}</p>  
      <button onClick={() => setText('Updated Text')}>  
        Update Text  
      </button>  
    </div>  
  );  
}  
  
// App 组件，结合了类组件和函数组件  
function App() {  
  return (  
    <div>  
      <h1>React State Example</h1>  
      <ClassComponent />  
      <FunctionalComponent />  
    </div>  
  );  
}  
  
export default App;